<#include "../macro/layout_default.ftl"/>
<@body>
<script src="/misc/app/js/department_list.js"></script>
</@body>

<#macro tree datalist,level>
    <#list datalist as item>
    <tr>
        <td>${item.id}</td>
        <td><#if (level>0)><#list 0..level*5 as a>&nbsp;</#list>|-- </#if>${item.name}</td>
        <td>
		 <button type="button" class="btn btn-default btn-xs" data-toggle="modal" data-target="#md_new_department" data-id="${item.id}">添加子部门</button>
           <!-- <#if (level>0)>
                <button type="button" class="btn btn-default btn-xs" data-toggle="modal" data-target="#md_edit_department" data-id="${item.id}" data-parent-id="${item.parentId!}" data-name="${item.name}">编辑</button>
                <button type="button" class="btn btn-default btn-xs" name="btn_delete_department" data-id="${item.id}">删除</button>
            </#if>
            -->
        </td>
    </tr>
        <#if (item.children?size > 0)>
            <@tree item.children,(level+1)></@tree>
        </#if>
    </#list>
</#macro>

<@layout_default>
<div class="box">
    <div class="box-body">
        <table class="table table-striped table-hover">
            <tr>
                <th>ID</th>
                <th>部门名称</th>
                <th>操作</th>
            </tr>
            <@tree departmentList,0></@tree>
        </table>
    </div>
</div>


<!--=========== Modals =============-->
<!-- md_new_department -->
<div class="modal" id="md_new_department" tabindex="-1">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel"><i class="fa fa-plus"></i> 添加子部门</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" name="form_new_department">
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><strong class="text-red bold">*</strong> 部门名称</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" placeholder="部门名称" name="name"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><strong class="text-red bold">*</strong> 父部门</label>
                        <div class="col-sm-10">
                            <select class="form-control" name="parentId"></select>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" name="btn_save_new_department">保存</button>
            </div>
        </div>
    </div>
</div>
<!-- md_edit_department -->
<div class="modal" id="md_edit_department" tabindex="-1">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel"><i class="fa fa-pencil-square-o"></i> 编辑部门</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" name="form_edit_department">
                    <input type="hidden" name="id"/>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><strong class="text-red bold">*</strong> 部门名称</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" placeholder="部门名称" name="name"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><strong class="text-red bold">*</strong> 父部门</label>
                        <div class="col-sm-10">
                            <select class="form-control" name="parentId"></select>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" name="btn_save_edit_department">保存</button>
            </div>
        </div>
    </div>
</div>
</@layout_default>